<header class="navbar navbar-inverse navbar-fixed-top" role="banner">
    <div class="container-fluid">
        <div class="navbar-header">
            <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a href="/book" class="navbar-brand">Book</a>
        </div>
        <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
            <ul class="nav navbar-nav">
                <li class="explorer-link">
                    <a href="/book/explorer">发现</a>
                </li>
                <#if session["user"].isUser()>
                    <#list session["user"].subscribedTags as tag>
                        <li class="<#if tag.equals(curTag)>active</#if>">
                            <a href="/book/explorer?tag=${tag.name}">${tag.name}</a>
                        </li>

                    </#list>
                    <#assign moreTags=session["user"].getSubscribedTags(2, 3)>
                    <#if (moreTags?size>0)>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">更多<b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <#list moreTags as tag>
                                    <#if tag.equals(curTag)>
                                        <script>
                                            $(document).ready(function(){
                                                $(".nav.navbar-nav li.explorer-link").addClass("active")
                                            });
                                        </script>
                                    </#if>
                                    <li class="<#if tag.equals(curTag)>active</#if>">
                                        <a href="/book/explorer?tag=${tag.name}">${tag.name}</a>
                                    </li>
                                </#list>
                                <li class="divider"></li>
                                <li><a href="/">订阅中心</a></li>
                            </ul>
                        </li>
                    </#if>
                </#if>


            </ul>
            <ul class="nav navbar-nav navbar-right">
                <#if session["user"].isUser()>
                    <li class="dropdown message-box">
                        <a href="javascript: void(0)" class="dropdown-toggle" data-toggle="dropdown">
                            <i class="glyphicon glyphicon-envelope" style="font-size: 16px; line-height: 20px"></i>
                            <span class="navbar-unread" style="font-size: 11px;position: absolute;top: 2px;right: 2px;">${session["user"].messageCount}</span>
                        </a>
                        <ul class="dropdown-menu">
                            <li class="divider"></li>
                            <li><a href="/account/message">消息中心</a></li>
                        </ul>
                    </li>
                    <script>
                        $(function(){
                            $(".message-box a.dropdown-toggle").on("click", function(){
                                $.get("/account/notify_message", function(response){
                                    $(".message-box ul .message-item").remove();
                                    $(".message-box ul").prepend($(response));
                                });
                            });
                        });
                    </script>
                    <li class="dropdown">
                        <a href="javascript: void(0)" class="dropdown-toggle" data-toggle="dropdown">${session["user"].nickname} <b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a href="/account/center">个人中心</a></li>
                            <li><a href="/book/create">写一本书</a></li>
                            <li class="divider"></li>
                            <li><a href="/logout">登出</a></li>
                        </ul>
                    </li>
                <#else >
                    <li>
                        <a href="javascript: Pinion.ajaxLogin()">登陆</a>
                    </li>
                    <li>
                        <a href="/register">注册</a>
                    </li>
                </#if>
            </ul>
        </nav>
    </div>
</header>
<script>
    $(document).ready(function(){
        console.log(window.location.pathname);
        if($(".nav.navbar-nav li.active").length == 0){
            $(".nav.navbar-nav").find("a[href='" + window.location.pathname + "']").closest("li").addClass("active")
        }
    });
</script>